@import 'util.sass'

\:host
  display: block

.model

  &-name
    @include flex-align(center, flex-start)

  &-name,
  &-content,
  code
    font-family: Consolas, Monaco, monospace

  code
    line-height: 22px
    border-radius: 4px

\:host ::ng-deep

  .hljs
    background: $bg-disabled
    color: $text-default

    .hljs-name, .hljs-keyword, .hljs-type, .hljs-attribute
      color: $primary-normal

    .hljs-title, .hljs-function > .hljs-title, .hljs-symbol, .hljs-bullet, .hljs-built_in, .hljs-builtin-name, .hljs-link
      color: fui-color(blue, 4)

    .hljs-string, .hljs-subst
      color: fui-color(green, 5)

    .hljs-params
      color: fui-color(red, 5)

    .hljs-comment
      color: $text-minor

    .hljs-number
      color: $secondary-active

    .hljs-literal
      color: fui-color(green, 5)
